List potential pitfalls or risks of Custom Hooks.

1
Stale Closures: Closures captured within hooks can lead to unexpected behaviour, especially in callbacks and effects. To avoid this, use the useCallback and useEffect dependency arrays properly.
2
Infinite Rerenders: Incorrectly updating state within an effect or using a hook inside a loop can lead to infinite re-renders. Ensure that you have proper dependencies and conditions in your effects.
3
Memory Leaks: Not cleaning up effects can lead to memory leaks. Make sure to return cleanup functions from your effects when needed.
4
Async Effects: When using asynchronous operations inside effects, ensure that you handle the cleanup correctly, cancelling any ongoing operations if the component unmounts.
5
Conditional Hooks: Conditionally calling hooks can violate the rules of hooks. Instead, use conditional logic within hooks to handle different cases.

Difficulty: 5/10

Topics: dependency arrays, memory leaks, performance

0-2 years experience

1
If you need to share a piece of form validation logic across two components, how would you implement it with a custom hook, and what could go wrong if you forget to include the proper dependency array?
2
What happens if a custom hook internally uses useEffect but you call it conditionally inside a component?

2-5 years experience

1
You added a custom hook that fetches data and caches it in a ref. After a recent refactor, the component sometimes shows stale data. Walk me through how you would debug this.
2
Explain why a custom hook that subscribes to a WebSocket might cause memory leaks, and how you would mitigate the risk.

5-8 years experience

1
In a large codebase, many teams have created similar custom hooks for data fetching, leading to duplicated logic and inconsistent error handling. How would you approach consolidating them while minimizing impact?
2
Discuss the performance implications of using a custom hook that creates a new object on every render, and how you would refactor it for a high‑traffic list component.

8+ years experience

1
Your organization is planning to migrate legacy class components to functional components with hooks. What strategy would you use to evaluate existing custom hooks for scalability and maintainability across teams?
2
Consider a cross‑team library of custom hooks that need to support both client‑side rendering and server‑side rendering. What architectural decisions and testing practices would you put in place to avoid subtle bugs?